<!DOCTYPE html>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%@ taglib uri="/tld/authority.tld" prefix="authority" %>
<%@ taglib uri="/tld/navigator.tld" prefix="navigator" %>
<%@ taglib uri="/tld/pagination.tld" prefix="page" %>

<%--<div class="pageheader">
    <h2>类别管理</h2>

    <div class="breadcrumb-wrapper">
        <span class="left color-999 font13">您当前的位置：</span>
        <ol class="breadcrumb left">
            <li>参数管理</li>
            <li>类别管理</li>
        </ol>
    </div>
</div>--%>
<navigator:navigator url="category/query.htm"/>

<div class="contentpanel">

    <div class="panel panel-default panel-bottom-no">
        <div class="row">
            <form>
                <input type="hidden" name="start" value="${query.start}">
                <input type="hidden" name="length" value="${query.length}">

                <div class="panel-body panel-body2 border-gray-b ">
                    <div class="col-md-7">
                        <div class="form-group input-group">
                            <div class="select-container select select-container50 input-group-btn col-dm-3">
                                <a class="select-choice select-choice2">
                                    <span>类别名称</span>
                                </a>
                            </div>
                            <input class="form-control form-control2" type="text" placeholder="请输入查询关键词" name="name" value="${query.name}">
                        </div>
                    </div>
                    <div class="btn-group2 left">
                        <button type="submit" class="btn btn-primary btn-4-query"><i class="icon icon-chaxun"></i>查询</button>
                    </div>
                </div>
            </form>
        </div>
    </div>

    <div class="panel panel-default">

        <div class="row">
            <div class="panel-body panel-body2  plr20">

                <div class="left">
                    <div class="btn-group left btn-group-none2">
                        <authority:authority url="/category/add">
                            <button class="btn btn-primary btn-4-add"><i class="icon icon-tianjia"></i>新增</button>
                        </authority:authority>
                    </div>
                </div>
            </div>
        </div>

        <%--Table--%>
        <div class="row">
            <div class=" plr20">
                <c:choose>
                    <c:when test="${query.showType == 0}">
                        <div class="display-table display-table-xs ">
                            <ul class="display-table display-table-th">
                                <li style="width:43px" class="table-cell"></li>
                                <li style="width:30%" class="table-cell">类别名称</li>
                                <li style="width:10%" class="table-cell">类别编码</li>
                                <li class="table-cell">父类别</li>
                                <li style="width:10%" class="table-cell">排序值</li>
                                <li style="width:15%" class="table-cell">操作</li>
                            </ul>
                            <ul class="display-table">
                                <c:forEach items="${paging.items}" var="item1">
                                    <li>
                                        <P class="display-table bj-green-lit display-table-tr">
                                        <span style="width:43px" class="table-cell">
                                            <i class="icon icon-shousuo cursor-pointer"></i>
                                        </span>
                                        <span style="width:30%" class="table-cell">${item1.name}</span>
                                        <span style="width:10%" class="table-cell">${item1.identifier}</span>
                                        <span class="table-cell">${item1.parents}</span>
                                        <span style="width:10%" class="table-cell">${item1.seq}</span>
                                        <span style="width:15%" class="table-cell display-table-caozuo">
                                            <authority:authority url="/category/modify">
                                                <a class="btn-4-modify" data-id="${item1.id}" style="font-weight:normal">修改</a>
                                            </authority:authority>
                                            <authority:authority url="/category/delete">
                                                <a class="btn-4-delete" data-id="${item1.id}" style="font-weight:normal">删除</a>
                                            </authority:authority>
                                        </span>
                                        </P>
                                        <c:forEach items="${item1.children}" var="item2">
                                            <ul class="display-table">
                                                <li class="table-row">
                                                    <p class="display-table">
                                                        <span style="width:43px" class="table-cell"></span>
                                                        <span style="width:30%; padding-left:30px;" class="table-cell">${item2.name}</span>
                                                        <span style="width:10%" class="table-cell">${item2.identifier}</span>
                                                        <span class="table-cell">${item2.parents}</span>
                                                        <span style="width:10%" class="table-cell">${item2.seq}</span>
                                                        <span style="width:15%" class="table-cell display-table-caozuo">
                                                            <authority:authority url="/category/modify">
                                                                <a class="btn-4-modify" data-id="${item2.id}" style="font-weight:normal">修改</a>
                                                            </authority:authority>
                                                            <authority:authority url="/category/delete">
                                                                <a class="btn-4-delete" data-id="${item2.id}" style="font-weight:normal">删除</a>
                                                            </authority:authority>
                                                        </span>
                                                    </p>
                                                    <c:forEach items="${item2.children}" var="item3">
                                                        <ul class="display-table">
                                                            <li style="width:43px" class="table-cell"></li>
                                                            <li style="width:30%; padding-left:60px;" class="table-cell">${item3.name}</li>
                                                            <li style="width:10%" class="table-cell">${item3.identifier}</li>
                                                            <li class="table-cell">${item3.parents}</li>
                                                            <li style="width:10%" class="table-cell">${item3.seq}</li>
                                                            <li style="width:15%" class="table-cell display-table-caozuo">
                                                                <authority:authority url="/category/modify">
                                                                    <a class="btn-4-modify" data-id="${item3.id}" style="font-weight:normal">修改</a>
                                                                </authority:authority>
                                                                <authority:authority url="/category/delete">
                                                                    <a class="btn-4-delete" data-id="${item3.id}" style="font-weight:normal">删除</a>
                                                                </authority:authority>
                                                            </li>
                                                        </ul>
                                                    </c:forEach>
                                                </li>
                                            </ul>
                                        </c:forEach>
                                    </li>
                                </c:forEach>
                            </ul>
                        </div>
                    </c:when>
                    <c:otherwise>
                        <div class="table-responsive">
                            <table class="table dataTable">
                                <tbody>
                                <tr>
                                    <th style="width: 50px"></th>
                                    <th><strong>类别名称</strong></th>
                                    <th><strong>父类别</strong></th>
                                    <th><strong>类别编码</strong></th>
                                    <th><strong>操作</strong></th>
                                </tr>
                                <c:forEach items="${paging.items}" var="item" varStatus="status">
                                    <tr>
                                        <td>${(paging.pageIndex - 1) * paging.pageSize + (status.index + 1)}</td>
                                        <td>${item.name}</td>
                                        <td>${item.parents}</td>
                                        <td>${item.identifier}</td>
                                        <td>
                                            <authority:authority url="/category/modify">
                                                <a class="btn-4-modify" data-id="${item.id}">修改</a>
                                            </authority:authority>
                                            <authority:authority url="/category/delete">
                                                <a class="btn-4-delete margin-l-10" data-id="${item.id}">删除</a>
                                            </authority:authority>
                                        </td>
                                    </tr>
                                </c:forEach>
                                </tbody>
                            </table>
                        </div>
                    </c:otherwise>
                </c:choose>
                <page:page pageIndex="${paging.pageIndex}" pageSize="${paging.pageSize}" count="${paging.count}"/>
            </div>
        </div>
    </div>
    <script src="js/dictionary/category-List.js" charset="UTF-8"></script>
</div>